<template>
	<view class="page">
		<view class="head-back">
			<view class="back" @click="onBack">
				<text></text>
			</view>
			<view class="title">
				<image src="/static/flash_title.png" mode=""></image>
			</view>
		</view>
		<view class="head-bg">
			<view class="session" :class="{'activity':scrollTop > 50}">
				<view class="list" :class="select_action==1?'action':''" @click="selectAction(1)">
					<text class="status">已结束</text>
				</view>
				<view class="list" :class="select_action==2?'action':''" @click="selectAction(2)">
					<text class="status">抢购中</text>
				</view>
				<view class="list" :class="select_action==3?'action':''" @click="selectAction(3)">
					<text class="status">即将开始</text>
				</view>
			</view>
		</view>
		<view class="goods-list">
			<view class="list" v-for="(item,index) in pro_list" 
			@click="onGoods"
			:key="index">
				<view class="thumb">
					<image :src="'/static/img/goods_thumb_0'+(index+1)+'.png'"></image>
				</view>
				<view class="item">
					<view class="title">
						<text class="one-omit">{{item.name}}</text>
					</view>
					
					<view class="price-data">
						<view class="price">
							<text>￥{{item.costprice}}</text>
							<text class="lineation ">￥{{item.price}}</text>
						</view>
						<view class="data">
							<view class="btn">
								<text>立即抢购</text>
							</view>
							<view class="schedule">
								<view class="num">50%</view>
								<view class="bar">
									<text></text>
								</view>
							</view>
						</view>
					</view>
				</view>
			</view>
		</view>
	</view>
</template>

<script>
	// 公共
	import common from '@/common/common.js'
	
	// 请求接口
	import $goods from '@/utils/api/goods.js';
	import $home from '@/utils/api/home.js';
	
	export default {
		data() {
			return {
				scrollTop: 0,
				select_action: 2,
				pro_list: []
			};
		},
		onPageScroll(e) {
			this.scrollTop = e.scrollTop;
		},
		onLoad() {
			this.getList()
		},
		methods:{
			getList(){
				// 利用缓存
				// 这里需要优化，因为假如秒杀时间快到，就不开缓存了，会影响体验
				var cache_data = common.cache('pro_list_'+this.select_action, null)
				if(cache_data){
					this.pro_list = cache_data
				}else{
					let param = {
						type: 4,
						select_action: this.select_action
					};
					$goods.get_promotion_list(param, 'GET').then(res => {
						this.pro_list = res.data
						common.cache('pro_list_'+this.select_action, res.data, 3600)
					});
					
				}
			},
			/**
			 * 返回
			 */
			onBack(){
				uni.navigateBack();
			},
			/**
			 * 商品点击
			 */
			onGoods(){
				uni.navigateTo({
					url: '/pages/GoodsDetails/GoodsDetails?type=1'
				})
			},
			selectAction(index){
				this.select_action = index
				this.getList()
			}
		}
	}
</script>

<style scoped lang="scss">
	@import 'promotion.scss';
</style>
